<template>
  <view class="container">
    <view class="form">
      <view class="form-group">
        <text class="label">用户名:</text>
        <input class="input" type="text" placeholder="请输入用户名" v-model="userphone" />
      </view>
      <view class="form-group">
        <text class="label">密码:</text>
        <input class="input" type="password" placeholder="请输入密码" v-model="password" />
      </view>
      <view class="form-group">
        <text class="label">支付密码:</text>
        <input class="input" type="password" placeholder="请输入支付密码" v-model="payment" />
      </view>
      <button class="register-btn" @click="register">注册</button>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      userphone: '',
      password: '',
	    payment: '',
    };
  },
  methods: {
    register() {
      
      if (!this.userphone || !this.payment || !this.password) {
        uni.showToast({
          title: '所有字段都是必填项',
          icon: 'none'
        });
        return;
      }
      // 发送请求进行账号注册
      uni.request({
        url: 'http://106.15.182.86:9099/api/register', 
        method: 'POST',
        data: {
          userphone: this.userphone,
          payment: this.payment,
          password: this.password
        },
        success: (res) => {
			 console.log(res.data)
          if (res.data.code === 200) {
            uni.showToast({
              title: '注册成功',
              icon: 'success',
			  duration: 2000 
            });
            // 页面跳转
            uni.navigateTo({
              url: '/pages/login/login' // 跳转到登录页面
            });
          } else if(res.data.code === 301 ){
		
            uni.showToast({
              title: '注册失败，账号已注册',
              icon: 'none',
			  duration: 2000 
            });
          }
        },
        fail: () => {
          uni.showToast({
            title: '网络请求失败，请稍后再试',
            icon: 'none'
          });
        }
      });
    }
  }
};
</script>

<style scoped>
.container {
  padding: 20px;
}

.form-group {
  margin-bottom: 15px;
}

.label {
  display: block;
  margin-bottom: 5px;
}

.input {
  width: 100%;
  height: 40px;
  padding: 0 10px;
  border: 1px solid #e1e1e1;
  border-radius: 5px;
}

.register-btn {
  width: 100%;
  height: 40px;
  background-color: #007aff;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer; /* 添加鼠标样式为指针，提高用户体验 */
}
</style>
